import { createApp } from "vue";
import "./style.css";
import App from "./App.vue";
import naive from "naive-ui";
import { createDiscreteApi } from "naive-ui";
import { createPinia } from "pinia";
import router from "./router";
import axios from "axios";
import { AdminStore } from "./stores/admin";

// import VueAxios from "vue-axios";
const { message, notification, dialog } = createDiscreteApi([
  "message",
  "dialog",
  "notification",
]);
/**
 * 初始化项目后需要安装的模块
 * axios
 * pinia
 * sass
 * vue-router
 * naive-ui
 * wangeditor
 *
 */
axios.defaults.baseURL = "http://127.0.0.1:3030";

const app = createApp(App);
// app.use(VueAxios, axios)
// 全局使用axios及naive-ui的提示组件
app.provide("axios", axios);
app.provide("message", message);
app.provide("notification", notification);
app.provide("dialog", dialog);
app.provide("server_url", axios.defaults.baseURL);

app.use(naive);
app.use(createPinia());

// 下面实例adminStore的代码及使用拦截器必须放在使用pinia之后，否则会报错
// 下面代码的作用是将token提交到请求头中去，这样就不用每次都验证了，这里把所有的请求都添加了token，
// 但是按理说只有请求中包含_token的才需要
const adminStore = AdminStore();
axios.interceptors.request.use((config) => {
  config.headers.token = adminStore.token;
  return config;
});
app.use(router);
app.mount("#app");
